<template>
    <div>
        <el-dialog style="margin-top:5vh" v-model="mer_off" :title="titlename" width="30%" :close-on-click-modal='false'
            @close="handleClose">
            <el-form ref="order" :model="getOrderInfo_data" label-width="110px" label-suffix="：">
                <el-form-item label="行程简称" :required="false">
                    <div style="font-weight:700">{{ getOrderInfo_data.routeSimpleName }}</div>
                </el-form-item>
                <el-form-item label="时间" :required="false">
                    <div style="font-weight:700;color:red">{{
                        getOrderInfo_data.flightDate ? getOrderInfo_data.flightDate : getOrderInfo_data.landDate }}
                    </div>
                </el-form-item>
                <el-form-item label="出发地址" :required="false">
                    <div style="font-weight:700;color:#066146">{{ getOrderInfo_data.fromLocation }}</div>
                </el-form-item>
                <div v-if="getOrderInfo_data.points">
                    <el-form-item v-for="item in getOrderInfo_data.points" label="途经地址" :required="false">
                        <div style="font-weight:700;color:rgb(52 227 14)">{{ item.stationName }}</div>
                    </el-form-item>
                </div>
                <el-form-item label="目的地址" :required="false">
                    <div style="font-weight:700;color:#066146">{{ getOrderInfo_data.toLocation }}</div>
                </el-form-item>
                <el-form-item label="联系人" :required="false">
                    <div style="font-weight:700;color:rgb(36 54 124)">{{ getOrderInfo_data.cusName + '-' +
                        getOrderInfo_data.cusMobile
                    }}</div>
                </el-form-item>
                <div v-if="getOrderInfo_data.persons">

                    <el-form-item v-for="(item, index) in getOrderInfo_data.persons"
                        :label="'联系人' + (Number(index) + 2)" :required="false">
                        <div style="font-weight:700;color:rgb(36 54 124)">{{ item.name + '-' +
                            item.mobile }}</div>
                    </el-form-item>
                </div>
                <el-form-item label="乘车人数" :required="false">
                    <div style="font-weight:700;color:red">{{ getOrderInfo_data.personNum }}（人）</div>
                </el-form-item>
                <el-form-item label="车型" :required="false">
                    <div style="font-weight:700;color:red">{{
                        getOrderInfo_data.regularCarMoney == 0 ? '不限车型' : getOrderInfo_data.needSeats + '座' }}</div>
                </el-form-item>
            </el-form>
            <div style="width:100%;height:2px;background:#0000004a;"></div>
            <div style="width:100%;background:#DDE3E9;margin-top:10px;    cursor: context-menu;">
                <div @click="couponMd_btn" v-if="companyNum_off2"
                    style="width:100%;font-weight:700;height:30px;font-size:16px;display:flex;justify-content: space-between;align-items: center;">
                    <div style="margin-left:20px">选择优惠券</div>
                    <div :style="{ 'color': useCoupon.money > 0 ? '#ff9900' : '#999' }" style="margin-right:10px">{{
                        useCouponText }} &nbsp; &nbsp;></div>
                </div>
                <div style="width:100%;height:2px;background:#fff"></div>

                <div v-if="getOrderInfo_data.nightMoney > 0"
                    style="display: flex;justify-content:space-between;margin-top:0px;font-size: 15px;font-weight: 700;padding: 5px 10px;">
                    <div>夜班费
                    </div>
                    <div style="color:  #41A863;">+￥{{ getOrderInfo_data.nightMoney }}</div>
                </div>

                <div v-if="getOrderInfo_data.pointMoney > 0"
                    style="display: flex;justify-content:space-between;margin-top:0px;font-size: 15px;font-weight: 700;padding: 5px 10px;">
                    <div>加点费
                    </div>
                    <div style="color:  #41A863;">+￥{{ getOrderInfo_data.pointMoney ? getOrderInfo_data.pointMoney : 0
                    }}
                    </div>
                </div>
                <div v-if="getOrderInfo_data.needSeats > 5"
                    style="display: flex;justify-content:space-between;margin-top:0px;font-size: 15px;font-weight: 700;padding: 5px 10px;">
                    <div>指定用车金额
                    </div>
                    <div style="color: #41A863;">+￥{{ vehiclesCar.money }}</div>
                </div>
                <div v-if="useCoupon.id"
                    style="display: flex;justify-content:space-between;margin-top:0px;font-size: 15px;font-weight: 700;padding: 5px 10px;">
                    <div>优惠券
                    </div>
                    <div style="color: #41A863;">-￥{{ useCoupon.money }}</div>
                </div>


                <div style='margin:0 10px;'>
                    <checkbox-group placement="column" :wrap="true">

                        <div style="display: flex;align-items: center;justify-content:space-between;">
                            <div style="display: flex;align-items: center;">
                                <el-checkbox :disabled='getOrderInfo_data.companyNum' @change="bzUseCar_btn"
                                    v-model="bzUseCar.check" :name="2" :label="bzUseCar.label">
                                </el-checkbox>
                                <div v-if="bzUseCar_show1" style="color: red;">（需及时关注是否被接单）</div>
                            </div>
                            <div v-if="bzUseCar.check" style="color: #41A863;font-weight:700">+￥{{ bzUseCar.money }}
                            </div>

                        </div>
                        <div v-if="bashibi_off && companyNum_off2"
                            style="display: flex;align-items: center;justify-content:space-between;">
                            <div style="display: flex;align-items: center;">
                                <el-checkbox @change="useBsCoin_btn" :label="useBsCoin.label"
                                    :disabled="useBsCoin.balance == 0" v-model="useBsCoin.check"
                                    :name="1"></el-checkbox>
                                <div style="color: red;">（余额 {{ useBsCoin.balance }}个，订单价可抵扣{{ useBsCoin.ratio * 100
                                }}%）
                                </div>
                            </div>
                            <div v-if="useBsCoin.check" style="color: #a87230;font-weight:700">-￥{{ useBsCoin.money }}
                            </div>
                        </div>


                        <div v-if='getOrderInfo_data.type != 0'
                            style="display: flex;align-items: center;justify-content:space-between;">
                            <div style="display: flex;align-items: center;">
                                <el-checkbox @change="isHighSpeed_btn" v-model="isHighSpeed.check" :name="4"
                                    :label="isHighSpeed.label">
                                </el-checkbox>
                            </div>

                            <div v-if="isHighSpeed.check" style="color: #41A863;font-weight:700">+￥{{ isHighSpeed.money
                            }}
                            </div>

                        </div>
                        <div style="color: red;font-weight:700">
                            天府机场车价默认含天府机场高速过路费及免费高速路段！
                        </div>
                    </checkbox-group>
                </div>






                <div style="display: flex;justify-content: flex-end;padding: 15px 0;">
                    <div style="font-weight: 700;font-size: 20px;">实付金额:<span style="color: red;padding: 5px 10px;">￥{{
                        finalPayMoney
                            }}</span>
                    </div>
                    <!-- getOrderInfo_data.oldPrice  -->
                    <div style="color: #999;font-weight: 300;font-size: 20px;text-decoration: line-through;">
                        (原价￥{{ oldPricePayMoney }})</div>

                </div>

            </div>
            <div class="pay-other-con" style='margin:15px 0px;'>
                <div style="display: flex;align-items: center;">
                    <div style="font-weight: 700;font-size: 16px;">派车时车牌驾驶员电话：</div>
                    <el-select v-model="noticeMan_data" placeholder="请选择通知对象" style="width: 240px">
                        <el-option label="通知乘客" :value="0" />
                        <el-option label="通知下单人" :value="1" />
                    </el-select>
                </div>
            </div>
            <div style="width: 100%;margin-top: 40rpx;margin-left:8%">
                <el-button style="width:40%" @click="weixin_pay_btn" type="warning">微信支付</el-button>
                <el-button style="width:40%" @click="Wallet_pay_btn" type="primary"> {{
                    getOrderInfo_data.companyNum ? `车队余额(${getCompanyByUserId_data})` : `平台余额(${Wallet_data})` }}
                </el-button>
            </div>


        </el-dialog>
        <!-- 弹窗 -->
        <template>
            <el-dialog append-to-body style="margin-top:5vh" v-model="couponMd.show" title="选择优惠券" width="50%"
                :close-on-click-modal='false' @close="couponMd_show_btn">
                <div style="height: 750px; overflow-y: hidden;backgroud:red;">
                    <div
                        style="font-size: 30px;font-weight: 600;color: #666666;padding-top: 0px;padding-left: 20px;line-height: 50px;border-bottom: 2px solid #f3f3f3;">
                        优惠券</div>

                    <div style="height: 750px;overflow-y: auto;">
                        <div
                            style="height: auto; overflow-y: hidden; padding-bottom: 60px;    background-color: #FFFFFF;margin: 10px 10px; border-radius: 12px;min-height: 400px;">
                            <div v-if="couponMd.uselist.length == 0">
                                <el-empty description="description" />
                            </div>


                            <div style="background-color: #ffffff;color: #ff9900;font-size: 28px;margin: 10px 10px;border-radius: 20px;"
                                v-for="(cp, index) in couponMd.uselist" :key="cp.id">
                                <div style="display: flex;
                                align-items: center;
                                padding: 10px 20px;
                                border: 10px;
                                background-color: #fff5f4;
                                border-top-left-radius: 12px;
                                border-top-right-radius: 12px;">
                                    <div style="font-size: 32px;">
                                        <div>
                                            ￥<text style="font-size: 60px;
                                            font-weight: bold;">{{ cp.highMoney }}</text>
                                        </div>
                                        <div class="type">现金券</div>
                                    </div>
                                    <div style="margin-left: 20px;">
                                        <div style="font-size: 24px;
                                        font-weight: bold;
                                        color: #303133;
                                        margin-bottom: 10px;">{{ cp.discountName }}</div>
                                        <div style="font-size: 16px;font-weight:700">使用有效期 {{ cp.provideStart }} ~ {{
                                            cp.provideEnd }}
                                        </div>
                                        <div style="font-size: 16px; color: #666;margin-top: 5px;font-weight:700 ">
                                            适用车型：{{ cp.stationIds }}座</div>
                                        <div style="font-size: 16px; color: #666;margin-top: 5px;font-weight:700 ">
                                            适用站点：{{ cp.stationNames }}</div>
                                    </div>
                                    <div
                                        style=" margin-left: 30px; padding: 0 20px;
                                  border-radius: 25px;line-height: 50px;background-color: #ff9900 !important; color: #ffffff !important;font-size: 24px;border: none;word-break: keep-all;">
                                        <el-checkbox-group v-model="checkList" @change="couponCkChange">
                                            <el-checkbox shape="circle" :value="cp.id"></el-checkbox>

                                        </el-checkbox-group>
                                    </div>
                                </div>

                                <div style="padding: 5px 20px;
                                border: 10px;
                                background-color: #f4f4f5;
                                position: relative;
                                color: #909399;
                                display: flex;
                               justify-content: flex-start;
                                line-height: 20px;
                                font-size: 16px;
                                border-bottom-left-radius: 12px;
                                border-bottom-right-radius: 12px;">
                                    <div style="position: absolute;
                                    height: 36px;
                                    width: 18px;
                                    background-color: #f2f2f2;border-radius: 0 40px 40px 0;
                                    left: 0;
                                    top: -18px;"></div>
                                    <div style="position: absolute;
                                    height: 36px;
                                    width: 18px;
                                    background-color: #f2f2f2;border-radius: 40px 0 0 40px;
                                    right: 0;
                                    top: -18px;"></div>
                                    <div>使用规则:</div>
                                    <div style="font-size: 16px;
                                                    display: flex;
                                                    align-items: center;
                                                    width: 720px;
                                                    margin-left: 20px;">
                                        <text style="margin-right: 10px;
                                                        flex: 1;">
                                            {{ cp.note }}</text>

                                    </div>
                                </div>
                            </div>


                            <div class="nouse-list set-gray-bg" v-if="couponMd.nouselist.length > 0">
                                <div class="nouse-list-title">
                                    <el-divider>不能使用的优惠券</el-divider>
                                </div>
                                <div style="background-color: #ffffff;color: #ff9900;font-size: 28px;margin: 10px 10px;border-radius: 20px;"
                                    v-for="(cp, index) in couponMd.nouselist" :key="cp.id">
                                    <div style="display: flex;
                                align-items: center;
                                padding: 10px 20px;
                                border: 10px;
                                color:#a4a4a4;
                                background-color: #f4f4f5;
                                border-top-left-radius: 12px;
                                border-top-right-radius: 12px;">
                                        <div style="font-size: 32px;">
                                            <div>
                                                ￥<text style="font-size: 60px;
                                            font-weight: bold;">{{ cp.highMoney }}</text>
                                            </div>
                                            <div class="type">现金券</div>
                                        </div>
                                        <div style="margin-left: 20px;">
                                            <div style="font-size: 24px;
                                        font-weight: bold;
                                        color: #303133;
                                        margin-bottom: 10px;">{{ cp.discountName }}</div>
                                            <div style="font-size: 16px;font-weight:700">使用有效期 {{ cp.provideStart }} ~
                                                {{
                                                    cp.provideEnd }}
                                            </div>
                                            <div style="font-size: 16px; color: #666;margin-top: 5px;font-weight:700 ">
                                                适用车型：{{ cp.stationIds }}座</div>
                                            <div style="font-size: 16px; color: #666;margin-top: 5px;font-weight:700 ">
                                                适用站点：{{ cp.stationNames }}</div>
                                        </div>

                                    </div>

                                    <div style="padding: 5px 20px;
                                border: 10px;
                                background-color: #f4f4f5;
                                position: relative;
                                color: #909399;
                                display: flex;
                               justify-content: flex-start;
                                line-height: 20px;
                                font-size: 16px;
                                border-bottom-left-radius: 12px;
                                border-bottom-right-radius: 12px;">
                                        <div style="position: absolute;
                                    height: 36px;
                                    width: 18px;
                                    background-color: #f2f2f2;border-radius: 0 40px 40px 0;
                                    left: 0;
                                    top: -18px;"></div>
                                        <div style="position: absolute;
                                    height: 36px;
                                    width: 18px;
                                    background-color: #f2f2f2;border-radius: 40px 0 0 40px;
                                    right: 0;
                                    top: -18px;"></div>
                                        <div>使用规则:</div>
                                        <div style="font-size: 16px;
                                                    display: flex;
                                                    align-items: center;
                                                    width: 720px;
                                                    margin-left: 20px;">
                                            <text style="margin-right: 10px;
                                                        flex: 1;">
                                                {{ cp.note }}</text>

                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>



                </div>
            </el-dialog>

            <el-dialog append-to-body style="margin-top:5vh" v-model="weixin_off" title="微信支付" width="30%"
                :close-on-click-modal='false'>
                <div style="text-align: center;margin-bottom:20px;font-weight:700;font-size:16px;color:#FF6300">
                    扫码支付{{ finalPayMoney }}元</div>
                <div style="width:200px;height:200px;margin: auto;" id="myQrCode" ref="myQrCode"></div>



                <el-button @click="weixin_pay_ok" style="margin-left:23vw;margin-top:20px"
                    type="warning">我已支付</el-button>

            </el-dialog>

            <el-dialog append-to-body style="margin-top:5vh" v-model="Wallet_pay_off" title="零钱支付" width="30%"
                :close-on-click-modal='false'>
                <el-form ref="order" :model="Wallet_pay_data" label-width="110px" label-suffix="：">
                    <el-form-item label="支付密码" :required="false">
                        <el-input show-password type="password" v-model="Wallet_pay_data.pwd" placeholder="请输入支付密码">
                            <template #prefix>
                                <el-icon class="el-input__icon">
                                    <CreditCard />
                                </el-icon>
                            </template>
                        </el-input>
                    </el-form-item>
                </el-form>
                <el-button @click="Wallet_pay_ok" style="margin-left:23vw;margin-top:20px"
                    type="primary">确认支付</el-button>
            </el-dialog>
        </template>
    </div>
</template>

<script setup>
import { ref, reactive, onMounted, computed, watch } from 'vue'
let props = defineProps(["data", "id", 'payment_data']);
const emit = defineEmits(['paymentCarMd'])

import QRCode from 'qrcodejs2-fix';
import { ElMessage, ElLoading, ElMessageBox } from 'element-plus'
import {
    getOrderInfo, findUseCouponListByOrder, getCashPayIsNeddPass, wxPayOmsOrdersByQrCode, wxPayRechargeByQrCode, findMyWallet,
    cashPayIsNeedPass, queryWXPayOrder, payOmsOrders, getTolls, getCompanyByUserId,
} from '@/api/original_order_list.js'
onMounted(() => {
    console.log(props.id)
    payment_data2.value = {}
    payment_data2.value = props.payment_data
    titlename.value = '申请付款'
    if (payment_data2.value.data1) {

        if (payment_data2.value.data1.off) {
            titlename.value = '去程申请付款'
            payment_off.value = true
        } else {
            titlename.value = '返程申请付款'
            payment_off.value = false
        }
    } else {
        payment_off.value = false
        // console.log(props.payment_data,payment_data2.value,'2222222')
    }
    getOrderInfo({ id: props.id }).then(res => {

        getOrderInfo_data.value = res.data

        let cusInfo = getOrderInfo_data.value.cusInfo.split(',')
        let cusInfo_index = cusInfo.shift()

        getOrderInfo_data.value.cusName = cusInfo_index.split('-')[0]
        getOrderInfo_data.value.cusMobile = cusInfo_index.split('-')[1]
        let arr_persons = []
        for (let i = 0; i < cusInfo.length; i++) {
            let cusInfo_data = {
                name: '',
                mobile: '',
            }
            cusInfo_data.name = cusInfo[i].split('-')[0]
            cusInfo_data.mobile = cusInfo[i].split('-')[1]
            arr_persons.push(cusInfo_data)


        }
        if (getOrderInfo_data.value.companyNum == '8112010001') {
            companyNum_off2.value = true
        } else if (getOrderInfo_data.value.companyNum == '') {
            companyNum_off2.value = true
        } else if (getOrderInfo_data.value.companyNum == null) {
            companyNum_off2.value = true
        } else {
            companyNum_off2.value = false
        }
        let luser = JSON.parse(localStorage.getItem("luser"))
        getCompanyByUserId({ userId: luser.uname }).then(res => {

            if (res.code == 1) {
                getCompanyByUserId_list.value = res.data
                if (res.data.length > 0) {
                    for (let i = 0; i < res.data.length; i++) {
                        if (res.data[i].companyNum == getOrderInfo_data.value.companyNum) {
                            getCompanyByUserId_data.value = res.data[i].balance
                        }
                    }
                }
            }

        })
        getOrderInfo_data.value.persons = arr_persons

        wallet_data_id.value = props.id
        luser.value = JSON.parse(localStorage.getItem('luser'))
        getOrderInfo_data.value.userId = luser.value.uname
        console.log(getOrderInfo_data.value.userId)
        bashibi_fn()
        getBzUseCarPrice()
        getvehiclesCarPrice()
        getisHighSpeedPrice() // 获取走高速价格
        findUseCouponListByOrder({ orderId: props.id }).then(res => {
            if (res) {
                let uselist = res.data.uselist;
                uselist.forEach(it => {
                    it.couponCheck = false;
                });
                couponMd.uselist = uselist;

                couponMd.nouselist = res.data.nouselist;
                // couponMd.nouselist = uselist;
            }
        })
    })
    findMyWallet_data()

})
const getCompanyByUserId_list = ref([])
const getCompanyByUserId_data = ref('')
const companyNum_off2 = ref(false)
const payment_off = ref(false)
const payment_data2 = ref({})
//#region 弹框控制
const mer_off = ref(props.data)
const handleClose = () => {
    emit('paymentCarMd', false);


};
//#endregion
// 原价
const oldPricePayMoney = computed(() => {
    let o = getOrderInfo_data.value
    if (o) {
        let res = parseFloat(o.oldPrice);
        let res2 = parseFloat(o.price);
        // // 优惠券
        // if (useCoupon.id) { // 使用了优惠券
        //     res -= parseFloat(useCoupon.money);
        //     res2 -= parseFloat(useCoupon.money);
        //     if (useBsCoin.check) { // 使用了巴士币
        //         // 抵扣的巴士币=计算订单价格扣除优惠券金额后金额的使用耍币比例
        //         let pro60 = parseFloat((res2 * parseFloat(useBsCoin.ratio)).toFixed(2));
        //         pro60 = Math.floor(pro60)
        //         // console.log(pro60, '-------------')
        //         if (pro60 > useBsCoin.balance) {
        //             // 大于巴士币余额，则扣除所有巴士币
        //             pro60 = useBsCoin.balance;
        //         }
        //         useBsCoin.money = pro60;

        //         if (pro60 > 0) res2 -= pro60;
        //     } else {
        //         useBsCoin.money = 0;
        //     }
        // } else { // 未使用优惠券
        //     if (useBsCoin.check) { // 使用了巴士币
        //         // 抵扣的巴士币=计算订单价格扣除优惠券金额后金额的使用耍币比例
        //         let pro60 = parseFloat((res2 * parseFloat(useBsCoin.ratio)).toFixed(2));
        //         pro60 = Math.floor(pro60)
        //         // console.log(res2, useBsCoin.ratio, pro60, '-------------')
        //         if (pro60 > useBsCoin.balance) {
        //             // 大于巴士币余额，则扣除所有巴士币
        //             pro60 = useBsCoin.balance;
        //         }
        //         useBsCoin.money = pro60;

        //         if (pro60 > 0) res -= pro60;
        //     } else {
        //         useBsCoin.money = 0;
        //     }
        // }

        // 感谢费
        if (o.thanksFee && o.thanksFee > 0) {
            res += parseFloat(o.thanksFee);
        }

        // 100%保障用车
        if (bzUseCar.check) {
            res += parseFloat(bzUseCar.money);
        }

        // 是否走高速
        if (isHighSpeed.check) {
            res += parseFloat(isHighSpeed.money);
        }

        // 指定用车
        if (o.needSeats > 5) {
            res += parseFloat(vehiclesCar.money);
        }
        // if (vehiclesCar.check) {
        // 		res += parseFloat(vehiclesCar.money);
        // 	}

        // // 夜班费

        // if (that.order.nightMoney > 0) {
        // 	res += parseFloat(that.order.nightMoney);
        // }

        // // 加点费

        // if (that.order.wayPointsMoney > 0) {
        // 	res += parseFloat(that.order.wayPointsMoney);
        // }

        // console.log(o.thanksFee,that.bzUseCar.money,that.vehiclesCar.money,'---',that.order.nightMoney,that.order.wayPointsMoney,o.price)
        // 抵扣最多支付金额不能小于0
        if (res < 0) res = 0;

        return res;
    }

    console.log(o)
    return 0
})
//#region 实际费用
const finalPayMoney = computed(() => {
    let o = getOrderInfo_data.value
    if (o) {
        let res = parseFloat(o.price);
        let res2 = parseFloat(o.price);
        if (o.isCancelPaid == 1) {
            if (o.isHighSpeed == 1) {
                res = res - o.ensureMoney - o.regularCarMoney - o.tolls
            } else {
                res = res - o.ensureMoney - o.regularCarMoney
            }

        }

        // 优惠券
        if (useCoupon.id) { // 使用了优惠券
            res -= parseFloat(useCoupon.money);

            if (useBsCoin.check) { // 使用了巴士币
                // 抵扣的巴士币=计算订单价格扣除优惠券金额后金额的使用耍币比例
                let pro60 = parseFloat((res * parseFloat(useBsCoin.ratio)).toFixed(2));
                pro60 = Math.floor(pro60)
                // console.log(pro60, '-------------')
                if (pro60 > useBsCoin.balance) {
                    // 大于巴士币余额，则扣除所有巴士币
                    pro60 = useBsCoin.balance;
                }
                useBsCoin.money = pro60;

                if (pro60 > 0) res -= pro60;
            } else {
                useBsCoin.money = 0;
            }
        } else { // 未使用优惠券
            if (useBsCoin.check) { // 使用了巴士币
                // 抵扣的巴士币=计算订单价格扣除优惠券金额后金额的使用耍币比例
                let pro60 = parseFloat((res * parseFloat(useBsCoin.ratio)).toFixed(2));
                pro60 = Math.floor(pro60)
                // console.log(res2, useBsCoin.ratio, pro60, '-------------')
                if (pro60 > useBsCoin.balance) {
                    // 大于巴士币余额，则扣除所有巴士币
                    pro60 = useBsCoin.balance;
                }
                useBsCoin.money = pro60;

                if (pro60 > 0) res -= pro60;
            } else {
                useBsCoin.money = 0;
            }
        }

        // 感谢费
        if (o.thanksFee && o.thanksFee > 0) {
            res += parseFloat(o.thanksFee);
        }

        // 100%保障用车
        if (bzUseCar.check) {
            res += parseFloat(bzUseCar.money);
        }

        // 是否走高速
        if (isHighSpeed.check) {
            res += parseFloat(isHighSpeed.money);
        }

        // 指定用车
        if (o.needSeats > 5) {
            res += parseFloat(vehiclesCar.money);
        }
        // if (vehiclesCar.check) {
        // 		res += parseFloat(vehiclesCar.money);
        // 	}

        // // 夜班费

        // if (that.order.nightMoney > 0) {
        // 	res += parseFloat(that.order.nightMoney);
        // }

        // // 加点费

        // if (that.order.wayPointsMoney > 0) {
        // 	res += parseFloat(that.order.wayPointsMoney);
        // }

        // console.log(o.thanksFee,that.bzUseCar.money,that.vehiclesCar.money,'---',that.order.nightMoney,that.order.wayPointsMoney,o.price)
        // 抵扣最多支付金额不能小于0
        if (res < 0) res = 0;

        return res;
    }

    console.log(o)
    return 0
})
//#endregion
const titlename = ref('申请付款')
const noticeMan_data = ref(0)

//#region 巴士币
const bashibi_off = ref(false)
// 巴士币使用时段 bashibi_off
const bashibi_fn = () => {
    bashibi_off.value = false
    // 获取当前日期和时间
    let now = new Date(getOrderInfo_data.value.startTime);
    // 设置起始和结束日期范围

    let startDate = new Date('2024-11-01 00:00:00');
    let endDate = new Date('2025-01-25 23:59:59');
    let startDate2 = new Date('2025-02-08 00:00:00');
    let endDate2 = new Date('2025-03-31 23:59:59');
    // 检查当前时间是否在范围内
    if (now >= startDate && now <= endDate) {
        bashibi_off.value = true
    } else {
        console.log('巴士币当前时间不在指定范围内')
    }
    if (now >= startDate2 && now <= endDate2) {
        bashibi_off.value = true
    } else {
        console.log('巴士币当前时间不在指定范围内')
    }

}
const useBsCoin = reactive({
    label: '巴士币',
    check: false, // 是否使用
    balance: 0, // 余额
    money: 0, // 使用金额
    ratio: 0.15, // 使用比例 认证车队-20% 普通人-15%
})
const useBsCoin_btn = (e) => {
    if (e == false) {
        useBsCoin.check = false
    } else {
        useBsCoin.check = true
    }
}
//#endregion

//#region 订单数据
const getOrderInfo_data = ref({})

//#endregion

//#region 指定用车

const vehiclesCar = reactive({
    check: false, // 是否使用
    money: 0, // 金额
    label: '指定用车',
})
const getvehiclesCarPrice = () => {
    let o = getOrderInfo_data.value
    // if (o.needSeats > 5) {
    // 	vehiclesCar.check = true
    // }

    // if (o.oldPrice == o.price) {
    //     let mer = 1
    //     vehiclesCar.money = parseFloat(mer)
    // } else {
    //     let mer = Math.ceil(o.basePrice * 0.05)

    // }
    vehiclesCar.money = parseFloat(o.regularCarMoney)
}
const vehiclesCar_btn = (e) => {
    if (e == false) {

        vehiclesCar.check = false
    } else {
        vehiclesCar.check = true

    }
}
//#endregion

//#region 100%保障用车
const bzUseCar = reactive({
    check: true, // 是否使用
    money: 0, // 金额
    label: '100%保障用车',
})
const bzUseCar_show1 = ref(false)
const bzUseCar_show = ref(false)
const bzUseCar_btn = (e) => {
    console.log(e)
    if (e == false) {
        bzUseCar_show1.value = true
        bzUseCar_show.value = true
        bzUseCar.check = false
    } else {
        bzUseCar.check = true
        bzUseCar_show1.value = false
    }
}
const bzUseCar_show_confirm = () => {
    bzUseCar_show.value = false
}
const getBzUseCarPrice = () => {

    let o = getOrderInfo_data.value
    let mer = o.ensureMoney
    bzUseCar.money = parseFloat(mer)
    // console.log(o,o.ensureMoney, bzUseCar.money,'bzUseCar.money')
    // if (o.oldPrice == o.price) {
    //     let mer = 1
    //     bzUseCar.money = parseFloat(mer)
    // } else {
    //     let mer = Math.ceil(o.oldPrice * 0.05)
    //     bzUseCar.money = parseFloat(mer)
    // }
}
//#endregion
//#region 是否走高速
// 
const isHighSpeed = reactive({
    check: true, // 是否使用
    money: 0, // 金额
    label: '是否走高速',
})
const isHighSpeed_btn = (e) => {
    if (e == false) {

        isHighSpeed.check = false
    } else {
        isHighSpeed.check = true

    }
}





const getisHighSpeedPrice = () => {

    let o = getOrderInfo_data.value

    let ps = {
        fromLocationData: null,
        points: null,
        toLocationData: null,
        type: null,
        needSeats: null,
        personNum: null,
    }
    ps.fromLocationData = o.fromLocationData
    ps.fromLocationData = o.fromLocationData
    ps.points = o.points
    ps.toLocationData = o.toLocationData
    ps.type = o.type
    ps.routeSimpleName = o.routeSimpleName
    ps.needSeats = o.needSeats
    ps.personNum = o.personNum
    if (ps.type != 0) {
        getTolls(ps).then(res => {
            console.log(res, 1111)
            let mer = res.data
            isHighSpeed.money = parseFloat(mer)
        })
    }


}



//#endregion


//#region 优惠卷
const useCoupon = reactive({
    id: '', // 优惠券id
    money: 0 // 优惠券金额
})
// 优惠券弹框
const couponMd = reactive({
    show: false,
    uselist: [], // 能使用的优惠券列表
    nouselist: [], // 不能使用的优惠券列表
})
const useCouponText = computed(() => {
    if (useCoupon.id) {
        return '已使用1张优惠券';
    } else {
        if (couponMd.uselist.length > 0) {
            return couponMd.uselist.length + '张优惠券可使用';
        } else {
            return '暂无优惠券';
        }
    }
})
const couponMd_btn = () => {

    couponMd.show = true
    console.log(couponMd.show)
}
const couponMd_show_btn = () => {
    couponMd.show = false
}
const checkList = ref([])
// 选择优惠券-完成
const couponCkChange = (e) => {
    if (e.length > 0) {
        checkList.value = [e[e.length - 1]]
        let cp = couponMd.uselist.find(it => it.id == e.name);
        for (let i = 0; i < couponMd.uselist.length; i++) {
            if (checkList.value[0] == couponMd.uselist[i].id) {
                useCoupon.id = couponMd.uselist[i].id
                useCoupon.money = couponMd.uselist[i].highMoney
            }
        }
    } else {
        checkList.value = []
        useCoupon = {
            id: '',
            money: 0
        }
    }


    couponMd.show = false;

    console.log('选择的优惠券', useCoupon);
}

const time = (val, fmt = "yyyy-MM-dd HH:mm") => {
    if (!val) return '';

    if ((typeof val == 'object') && val.constructor == Date) {
        return date2str(val, fmt);
    } else if ((typeof val == 'string') && val.constructor == String) {
        let date = str2date(val);
        return date2str(date, fmt);
    } else {
        return val;
    }
}
const date2str = (date, fmt) => {
    return datefmt(date, fmt);
}
const datefmt = (date, format = 'yyyy-MM-dd HH:mm') => {
    let fmt = format;

    if (!date) return '';

    // 传入的是时间字符串，则转换成时间类型
    if (typeof (date) === 'string') date = str2date(date);
    if (format.indexOf('-') != -1) format = format.replace(/-/g, '/');

    const pad = (n) => (n < 10 ? `0${n}` : n.toString());

    let res = format
        .replace('yyyy', date.getFullYear())
        .replace('MM', pad(date.getMonth() + 1))
        .replace('dd', pad(date.getDate()))
        .replace('HH', pad(date.getHours()))
        .replace('mm', pad(date.getMinutes()))
        .replace('ss', pad(date.getSeconds()));
    if (fmt.indexOf('-') != -1) res = res.replace(/\//g, '-');

    return res;
}
const str2date = (dateStr) => {
    if (dateStr.indexOf('-') != -1) dateStr = dateStr.replace(/-/g, '/');
    return new Date(dateStr);
}

//#endregion

//#region 微信支付
// 二维码
const myQrCode = ref('')
const generateCode = (codeUrl) => {
    document.getElementById("myQrCode").innerHTML = ""
    try {
        new QRCode(myQrCode.value, {
            width: 200, //宽度
            height: 200, // 高度
            text: codeUrl, // 二维码内容
        })
    } catch (e) {
        console.log(e)
    }
}
const weixin_pay_ok = () => {
    queryWXPayOrder({ orderPayNum: weixin_data.value.out_trade_no }).then(res => {
        if (res.code == '1') {
            if (res.data.trade_state_desc == '订单未支付') {

                return ElMessage({
                    message: res.data.trade_state_desc,
                    type: 'warning',
                })
            } else {
                weixin_off.value = false

                if (payment_off.value) {
                    let psdata = {
                        data1: {
                            id: payment_data2.value.data1.id,
                            off: false,
                            name: 1,
                        },
                        data2: {
                            id: payment_data2.value.data2.id,
                            off: true,
                            name: 2,
                        }
                    }
                    emit('paymentCarMd', payment_data2.value.data2.id, psdata);
                } else {
                    emit('paymentCarMd', false, false);
                }

                return ElMessage({
                    message: res.data.trade_state_desc,
                    type: 'success',
                })
            }

        }



    })
}
const weixin_data = ref({})
const weixin_off = ref(false)
const weixin_pay_btn = () => {
    let luser = JSON.parse(localStorage.getItem('luser'))
    if (luser) {
        let ps = {
            couponId: useCoupon.id ? useCoupon.id : 0,
            ensureMoney: bzUseCar.check ? bzUseCar.money : 0,
            orderIds: [wallet_data_id.value],
            payMoney: finalPayMoney.value,
            regularCarMoney: getOrderInfo_data.value.needSeats > 5 ? vehiclesCar.money : 0,
            regularSeats: getOrderInfo_data.value.needSeats ? getOrderInfo_data.value.needSeats : 0,
            usePointMoney: useBsCoin.money,
            noticeMan: noticeMan_data.value,
            isHighSpeed: isHighSpeed.check ? 1 : 0,
            tolls: isHighSpeed.check ? isHighSpeed.money : 0,

        }
        wxPayOmsOrdersByQrCode(ps).then(res => {
            if (res.code == '1') {
                weixin_data.value = res.data
                weixin_off.value = true
                setTimeout(() => {
                    generateCode(res.data.code_url)
                }, 500);
                // new QRCode(el, {
                //     width: 200,
                //     height: 200,
                //     text: res.data.code_url,

                // })
                // weixin_off.value = true
            } else {
                return ElMessage({
                    message: res.msg,
                    type: 'warning',
                })
            }
        })

    } else {
        return ElMessage({
            message: '登录信息异常，请联系管理人员',
            type: 'warning',
        })
    }

}
//#endregion

//#region 领钱支付
const Wallet_pay_data = ref({
    pwd: '',
})
const Wallet_pay_off = ref(false)
const Wallet_pay_btn = () => {
    // if (Wallet_data.value < finalPayMoney.value) {
    //     return ElMessage({
    //         message: '余额不足，请使用微信支付！',
    //         type: 'warning',
    //     })
    // } 
    // let ps = {
    //     couponId: useCoupon.id ? useCoupon.id : 0,
    //     ensureMoney: bzUseCar.check ? bzUseCar.money : 0,
    //     orderIds: [wallet_data_id.value],
    //     payMoney: finalPayMoney.value,
    //     regularCarMoney: getOrderInfo_data.value.needSeats > 5 ? vehiclesCar.money : 0,
    //     regularSeats: getOrderInfo_data.value.needSeats ? getOrderInfo_data.value.needSeats : 0,
    //     usePointMoney: useBsCoin.money,
    //     noticeMan: noticeMan_data.value,
    //     isHighSpeed: isHighSpeed.check ? 1 : 0,
    //     tolls: isHighSpeed.check ? isHighSpeed.money : 0,

    // }
    // return console.log(ps)
    getCashPayIsNeddPass({}).then(res => {
        if (res.data.cashPayIsNeedPass == 1) {
            let ps = {
                couponId: useCoupon.id ? useCoupon.id : 0,
                ensureMoney: bzUseCar.check ? bzUseCar.money : 0,
                orderIds: [wallet_data_id.value],
                payMoney: finalPayMoney.value,
                regularCarMoney: getOrderInfo_data.value.needSeats > 5 ? vehiclesCar.money : 0,
                regularSeats: getOrderInfo_data.value.needSeats ? getOrderInfo_data.value.needSeats : 0,
                usePointMoney: useBsCoin.money,
                noticeMan: noticeMan_data.value,
                isHighSpeed: isHighSpeed.check ? 1 : 0,
                tolls: isHighSpeed.check ? isHighSpeed.money : 0,

            }
            payOmsOrders(ps).then(res => {
                if (res.code == 1) {
                    if (payment_off.value) {
                        let psdata = {
                            data1: {
                                id: payment_data2.value.data1.id,
                                off: false,
                                name: 1,
                            },
                            data2: {
                                id: payment_data2.value.data2.id,
                                off: true,
                                name: 2,
                            }
                        }
                        emit('paymentCarMd', payment_data2.value.data2.id, psdata);
                    } else {
                        emit('paymentCarMd', false, false);
                    }
                    return ElMessage({
                        message: res.msg,
                        type: 'success',
                    })
                } else {
                    return ElMessage({
                        message: res.msg,
                        type: 'warning',
                    })
                }
            })
        } else {
            Wallet_pay_off.value = true
        }
    })
}

const Wallet_pay_ok = () => {
    // if (Wallet_data.value < finalPayMoney.value) {
    //     return ElMessage({
    //         message: '余额不足，请使用微信支付！',
    //         type: 'warning',
    //     })
    // }
    let ps = {
        couponId: useCoupon.id ? useCoupon.id : 0,
        ensureMoney: bzUseCar.check ? bzUseCar.money : 0,
        orderIds: [wallet_data_id.value],
        payMoney: finalPayMoney.value,
        regularCarMoney: getOrderInfo_data.value.needSeats > 5 ? vehiclesCar.money : 0,
        regularSeats: getOrderInfo_data.value.needSeats ? getOrderInfo_data.value.needSeats : 0,
        usePointMoney: useBsCoin.money,
        payPass: Wallet_pay_data.value.pwd,
        noticeMan: noticeMan_data.value,
        isHighSpeed: isHighSpeed.check ? 1 : 0,
        tolls: isHighSpeed.check ? isHighSpeed.money : 0,
    }
    payOmsOrders(ps).then(res => {
        if (res.code == 1) {
            Wallet_pay_off.value = false
            if (payment_off.value) {
                let psdata = {
                    data1: {
                        id: payment_data2.value.data1.id,
                        off: false,
                        name: 1,
                    },
                    data2: {
                        id: payment_data2.value.data2.id,
                        off: true,
                        name: 2,
                    }
                }
                emit('paymentCarMd', payment_data2.value.data2.id, psdata);
            } else {
                emit('paymentCarMd', false, false);

            }


            return ElMessage({
                message: res.msg,
                type: 'success',
            })
        } else {
            return ElMessage({
                message: res.msg,
                type: 'warning',
            })
        }
    })
}
//#endregion
// 订单号
const wallet_data_id = ref('')
// 原价价格
const wallet_price = ref(0)

const modal_content = ref('')
const ok_next_modal_show = ref(false)
const ok_modal_confirm = () => {
    ok_next_modal_show.value = false
}
const findMyWallet_data = () => {
    findMyWallet({}).then((res) => {
        Wallet_data.value = res.data.cashBalance.toFixed(2)
        useBsCoin.balance = parseFloat(res.data.recomPointBalance)
    })
}
// 我的余额 
const Wallet_data = ref(0)
const luser = ref({})


</script>

<style scoped lang='scss'>
.el-form-item {
    margin-bottom: 0px !important;
}

.my-popup-list {
    .top-left-title {
        font-size: 38px;
        font-weight: 600;
        color: #666666;
        padding-top: 0px;
        padding-left: 20px;
        line-height: 50px;
        border-bottom: 2px solid #f3f3f3;
    }

    .list-container {
        min-height: 400px;
        height: calc(100% - 80px);
        overflow-y: auto;
        background-color: #FFFFFF;
        margin: 10px 10px;
        border-radius: 12px;

        .not-new-user-tip {
            color: #999;
            padding: 20px;
            border-bottom: 2px solid #f3f3f3;
        }

        .empty-list {
            margin-top: 60px;
        }

        .coupon-item {
            background-color: #ffffff;
            color: #ff9900;
            font-size: 28px;
            margin: 20px 10px;
            border-radius: 20px;

            .content {
                display: flex;
                align-items: center;
                padding: 30px 20px;
                border: 10px;
                background-color: #fff5f4;
                border-top-left-radius: 12px;
                border-top-right-radius: 12px;

                .left {
                    .sum {
                        font-size: 32px;

                        .num {
                            font-size: 60px;
                            font-weight: bold;
                        }
                    }
                }

                .centre {
                    margin-left: 20px;

                    .title {
                        font-size: 32px;
                        font-weight: bold;
                        color: #303133;
                        margin-bottom: 20px;
                    }

                    .valid-date {
                        font-size: 24px;
                    }
                }

                .right {
                    margin-left: 30px;

                    .immediate-use {
                        padding: 0 20px;
                        height: 50px;
                        border-radius: 25px;
                        line-height: 50px;
                        background-color: #ff9900 !important;
                        color: #ffffff !important;
                        font-size: 24px;
                        border: none;
                        word-break: keep-all;
                    }
                }
            }

            .tips {
                padding: 0 20px;
                border: 10px;
                background-color: #f4f4f5;
                position: relative;
                color: #909399;
                display: flex;
                justify-content: space-between;
                line-height: 60px;
                font-size: 24px;
                border-bottom-left-radius: 12px;
                border-bottom-right-radius: 12px;

                .circle-left,
                .circle-right {
                    position: absolute;
                    height: 36px;
                    width: 18px;
                    background-color: #f2f2f2;
                }

                .circle-right {
                    border-radius: 40px 0 0 40px;
                    right: 0;
                    top: -18px;
                }

                .circle-left {
                    border-radius: 0 40px 40px 0;
                    left: 0;
                    top: -18px;
                }

                .rule {
                    font-size: 24px;
                    display: flex;
                    align-items: center;
                    width: 520px;
                    margin-left: 20px;

                    text {
                        margin-right: 10px;
                        flex: 1;
                    }
                }
            }
        }
    }
}

.order-coupon-list {



    .nouse-list {}

    .coupon-list-btns {
        background-color: #FFFFFF;
        width: 100%;
        position: fixed;

        padding: 10px 20px 20px 20px;
    }
}

.pay-other-con {
    margin: 20rpx;

    .u-checkbox {
        padding: 10rpx 0rpx;
    }

    .bs-coin-banlance {
        color: #666;
        font-size: 24rpx;
    }
}

// 支付方式
.pay-way-list {

    .pw-list {
        padding-top: 20rpx;

        .list-item {
            display: flex;
            padding: 20rpx 30rpx;
            border-bottom: 2rpx solid #f3f3f3;

            .it-icon {
                margin-right: 20rpx;
            }

            .it-text1 {
                flex: 1;
                line-height: 60rpx;
                font-size: 30rpx;
                color: #333333;
            }

            .it-text2 {
                flex: 1;
                line-height: 30rpx;
                font-size: 30rpx;
                color: #333333;

                .it-text-title {
                    font-size: 30rpx;
                    color: #333333;
                }

                .it-text-tip {
                    font-size: 24rpx;
                    color: #999;
                }
            }
        }
    }
}

.content_box_top {
    width: 100%;
    height: 200rpx;
    background-color: #41A863;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.content_box_list {
    background-color: #fff;
    width: 90%;
    margin: auto;
    margin-top: 20rpx;
    padding: 0rpx 20rpx;
}
</style>
